import 'package:flutter/material.dart';

class ContainerCase extends StatelessWidget {
  const ContainerCase({super.key});

  @override
  Widget build(BuildContext context) {
    // 容器组件：设置宽高，内外间距，对齐，盒子装饰
    return Container(
      width: 200,
      height: 200,
      // 注意：不建议直接设置 color 背景色，会跟 decoration 的 color 冲突报错
      // 建议：使用 decoration 背景装饰设置背景色
      // color: Colors.red,
      // 添加 padding
      padding: const EdgeInsets.all(20), // 四个方向统一设置
      // padding: const EdgeInsets.fromLTRB(30, 20, 10, 30), // 上 右 下 左
      // padding: const EdgeInsets.only(top: 30, left: 30), // 单独设置
      // padding: const EdgeInsets.symmetric(horizontal: 30), // 水平、垂直统一设置
      // 添加 margin
      margin: const EdgeInsets.all(20),
      // 对齐，支持 9 个方向，center 水平垂直居中
      alignment: Alignment.center,
      // 盒子装饰
      decoration: BoxDecoration(
        // 背景颜色
        color: Colors.blue,
        // 圆角
        borderRadius: BorderRadius.circular(30), // 四个方向圆角
        // 边框
        border: Border.all(color: Colors.green, width: 10),
        // 阴影，支持多个
        boxShadow: const [
          BoxShadow(
            color: Color.fromARGB(192, 0, 0, 129),
            offset: Offset(10, 10),
            blurRadius: 20,
          ),
        ],
        // 渐变，支持线性渐变、径向渐变
        gradient: const LinearGradient(
          colors: [
            Colors.red,
            Colors.orange,
          ],
          // 渐变方向
          begin: Alignment.topLeft,
          end: Alignment.bottomRight,
        ),
      ),
      child: const Text('hello flutter'),
    );
  }
}
